.custom-pc {
  #app {
    width: var(--width);
    max-width: var(--max-width);
    margin: auto;
  }

  uni-page,
  uni-page-body {
    border-left: var(--primary-plain-line);
    border-right: var(--primary-plain-line);
    max-height: 100vh;
    overflow: auto;
  }

  .m-modal {
    max-width: var(--modal-max-width);
  }

  .picker-box {
    max-width: var(--max-width);

    .u-popup__content {
      max-width: var(--max-width);
      width: 100%;
      margin: auto;
    }

    .u-picker {
      max-width: var(--max-width);
    }
  }

  .m-date {
    .mask-layer,
    .m-data-picker {
      max-width: var(--max-width);
    }
  }

  .keyboard {
    width: var(--max-width);

    > view {
      max-width: var(--max-width);
      margin: auto;
    }

    .u-popup__content {
      max-width: var(--max-width);
      margin: auto;
      width: 100%;
    }

    .u-keyboard {
      max-width: var(--max-width) !important;
    }
  }

  .uni-system-preview-image {
    max-width: var(--max-width);
    margin: auto;
    right: 0 !important;

    .image-view-view {
      margin: auto;
    }
  }

  // .file-box,
  // .popup-box {
  //   max-width: var(--max-width);
  //   margin: auto;

  //   .box {
  //     position: relative;
  //     height: 100%;
  //     max-width: var(--max-width);
  //     width: 100%;
  //   }

  //   .no-data {
  //     position: absolute;
  //     width: 100px;
  //     height: 20px;
  //     color: $color-placeholder;
  //     left: calc(50% - 50px);
  //     top: calc(50% - 10px);
  //   }

  //   .title {
  //     padding: 5px;
  //     color: #303030;
  //     border-bottom: $border_F2F2;
  //     display: flex;
  //     justify-content: space-between;
  //     align-items: center;
  //   }

  //   .u-upload {
  //     height: 300rpx;
  //     background-color: #fff;
  //     padding: 10px 10px;
  //   }

  //   .u-transition {
  //     max-width: var(--max-width);
  //     margin: auto;
  //     z-index: 999 !important;
  //   }
  // }

  .bottom-add {
    max-width: 500px;
  }
}
